// webpack.config.js
const VueLoaderPlugin = require('vue-loader/lib/plugin')
const path = require('path');
//const CleanWebpackPlugin = require('clean-webpack-plugin');
//const HtmlWebpackPlugin = require('html-webpack-plugin');


module.exports = {
    devtool: 'inline-source-map',
   
    mode: 'development',
     devServer: {  //自带web服务器的web文件路径。npm run start后热更新的文件保存在内存中，dist文件夹里面的文件不会有变化
        contentBase: './dist'
    },
    entry: './src/index.js',
    output: {
        path: __dirname + '/dist',
        filename: 'index_bundle.js'
    },
    resolve: { 
        alias: {//路径别名设置
          "@src": path.resolve(__dirname, 'src')
        }
    },

    module: {
        rules: [
            {
                test: /\.vue$/,
                loader: 'vue-loader'
            },
            // 它会应用到普通的 `.js` 文件
            // 以及 `.vue` 文件中的 `<script>` 块
            // {
            //     test: /\.js$/,
            //     loader: 'babel-loader'
            // },
            // 它会应用到普通的 `.css` 文件
            // 以及 `.vue` 文件中的 `<style>` 块
            {
                test: /\.css$/,
                use: [
                    'vue-style-loader',
                    'css-loader'
                ]
            }
        ]
    },
    plugins: [
        // 请确保引入这个插件来施展魔法
        new VueLoaderPlugin()
    ]
}